{include file="../app/view/common/header.html" subtitle="我的" page="user"}

<script>
    uid = {$uid};
</script>
<div id="root" class="root">
    <link href="/static/user/user.css" rel="stylesheet">
    <!-- 大背景图片 -->
    <img class="head-background" src="/static/img/bg.jpg" title="Designed by WZJian">
    <!-- 头像 -->
    <img class="facer" id="facer">
    <!-- 名字 -->
    <h1 class="name" id="name" style="display:inline;">name</h1>
    <!-- 设置 -->
    <button onclick="window.location.href = '/user/set'" data-v-cc52fb5c="" data-v-198686cd="" type="button" class="lfe-form-sz-middle" style="border-color: rgba(255, 255, 255, 0.5); color: rgb(255, 255, 255); background-color: rgba(0, 0, 0, 0.5);">
        <svg data-v-198686cd="" data-v-cc52fb5c="" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="user-cog" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512" class="svg-inline--fa fa-user-cog fa-w-20">
            <path data-v-198686cd="" data-v-cc52fb5c="" fill=" currentColor" d="M610.5 373.3c2.6-14.1 2.6-28.5 0-42.6l25.8-14.9c3-1.7 4.3-5.2 3.3-8.5-6.7-21.6-18.2-41.2-33.2-57.4-2.3-2.5-6-3.1-9-1.4l-25.8 14.9c-10.9-9.3-23.4-16.5-36.9-21.3v-29.8c0-3.4-2.4-6.4-5.7-7.1-22.3-5-45-4.8-66.2 0-3.3.7-5.7 3.7-5.7 7.1v29.8c-13.5 4.8-26 12-36.9 21.3l-25.8-14.9c-2.9-1.7-6.7-1.1-9 1.4-15 16.2-26.5 35.8-33.2 57.4-1 3.3.4 6.8 3.3 8.5l25.8 14.9c-2.6 14.1-2.6 28.5 0 42.6l-25.8 14.9c-3 1.7-4.3 5.2-3.3 8.5 6.7 21.6 18.2 41.1 33.2 57.4 2.3 2.5 6 3.1 9 1.4l25.8-14.9c10.9 9.3 23.4 16.5 36.9 21.3v29.8c0 3.4 2.4 6.4 5.7 7.1 22.3 5 45 4.8 66.2 0 3.3-.7 5.7-3.7 5.7-7.1v-29.8c13.5-4.8 26-12 36.9-21.3l25.8 14.9c2.9 1.7 6.7 1.1 9-1.4 15-16.2 26.5-35.8 33.2-57.4 1-3.3-.4-6.8-3.3-8.5l-25.8-14.9zM496 400.5c-26.8 0-48.5-21.8-48.5-48.5s21.8-48.5 48.5-48.5 48.5 21.8 48.5 48.5-21.7 48.5-48.5 48.5zM224 256c70.7 0 128-57.3 128-128S294.7 0 224 0 96 57.3 96 128s57.3 128 128 128zm201.2 226.5c-2.3-1.2-4.6-2.6-6.8-3.9l-7.9 4.6c-6 3.4-12.8 5.3-19.6 5.3-10.9 0-21.4-4.6-28.9-12.6-18.3-19.8-32.3-43.9-40.2-69.6-5.5-17.7 1.9-36.4 17.9-45.7l7.9-4.6c-.1-2.6-.1-5.2 0-7.8l-7.9-4.6c-16-9.2-23.4-28-17.9-45.7.9-2.9 2.2-5.8 3.2-8.7-3.8-.3-7.5-1.2-11.4-1.2h-16.7c-22.2 10.2-46.9 16-72.9 16s-50.6-5.8-72.9-16h-16.7C60.2 288 0 348.2 0 422.4V464c0 26.5 21.5 48 48 48h352c10.1 0 19.5-3.2 27.2-8.5-1.2-3.8-2-7.7-2-11.8v-9.2z" class=""></path>
        </svg>&nbsp;个人设置
    </button>

    <!-- 人生格言 -->
    <div class="life" id="life" class="tt"></div>
</div>
<div class="info">
    <div class="info-block" style="width: 80%;max-width: 500px; height: 400px;
    background: linear-gradient(to bottom right, #FF626E, #FFBE71);">
        <span class="title">一直的我</span>
        <div class="info-item">
            <div class="info-icon">
                <i class="
                icon
                mdui-icon
                material-icons
                mdui-text-color-white" style="font-size: 50px; text-align: center;">home</i>
            </div>
            <label class="mdui-textfield-label label" style="color: white;">我来自于</label>
            <div id="home_town" class="tt"></div>
        </div>
        <div class="info-item">
            <div class="info-icon">
                <i class="
                icon
                mdui-icon
                material-icons
                mdui-text-color-white" style="font-size: 50px; text-align: center;">today</i>
            </div>
            <label class="mdui-textfield-label label" style="color: white;">我出生于</label>
            <div id="birthday" class="tt"></div>
        </div>
        <div class="info-item">
            <div class="info-icon">
                <i class="
                icon
                mdui-icon
                material-icons
                mdui-text-color-white" style="font-size: 50px; text-align: center;">star</i>
            </div>
            <label class="mdui-textfield-label label" style="color: white;">我滴星座</label>
            <div id="star" class="tt"></div>
        </div>
        <div class="info-item">
            <div class="info-icon">
                <i class="
                icon
                mdui-icon
                material-icons
                mdui-text-color-white" style="font-size: 50px; text-align: center;">favorite</i>
            </div>
            <label class="mdui-textfield-label label" style="color: white;">爱好</label>
            <div id="love" class="tt"></div>
        </div>
        <div class="info-item">
            <div class="info-icon">
                <i class="
                icon
                mdui-icon
                material-icons
                mdui-text-color-white" style="font-size: 50px; text-align: center;">tag_faces</i>
            </div>
            <label class="mdui-textfield-label label" style="color: white;">特长</label>
            <div id="nb" class="tt"></div>
        </div>
    </div>

    <div class="info-block" style="width: 80%;max-width: 500px;height: 320px;
    background: linear-gradient(270deg, #88D4EB, #BD83F3);">
        <span class="title">现在的我</span>
        <div class="info-item">
            <div class="info-icon">
                <i class="
                icon
                mdui-icon
                material-icons
                mdui-text-color-white" style="font-size: 50px; text-align: center;">school</i>
            </div>
            <label class="mdui-textfield-label label" style="color: white;">就读学院</label>
            <div id="university" class="tt"></div>
        </div>
        <div class="info-item">
            <div class="info-icon">
                <i class="
                icon
                mdui-icon
                material-icons
                mdui-text-color-white" style="font-size: 50px; text-align: center;">work</i>
            </div>
            <label class="mdui-textfield-label label" style="color: white;">班内职务</label>
            <div id="job" class="tt"></div>
        </div>
        <div class="info-item">
            <div class="info-icon">
                <i class="
                icon
                mdui-icon
                material-icons
                mdui-text-color-white" style="font-size: 50px; text-align: center;">airline_seat_flat</i>
            </div>
            <label class="mdui-textfield-label label" style="color: white;">我住在</label>
            <div id="bed" class="tt"></div>
        </div>
        <div class="info-item">
            <div class="info-icon">
                <i class="
                icon
                mdui-icon
                material-icons
                mdui-text-color-white" style="font-size: 50px; text-align: center;">face</i>
            </div>
            <label class="mdui-textfield-label label" style="color: white;">政治面貌</label>
            <div id="gov" class="tt"></div>
        </div>
    </div>

    <div class="info-block" style="width: 80%;max-width: 500px; height: 320px;
    background: linear-gradient(333deg, #FDD819, #E04C4C);">
        <span class="title">现在的我</span>
        <div class="info-item">
            <div class="info-icon">
                <i class="
                icon
                mdui-icon
                material-icons
                mdui-text-color-white" style="font-size: 50px; text-align: center;">cloud</i>
            </div>
            <label class="mdui-textfield-label label" style="color: white;">旧梦</label>
            <div id="old_dream" class="tt"></div>
        </div>
        <div class="info-item">
            <div class="info-icon">
                <i class="
                icon
                mdui-icon
                material-icons
                mdui-text-color-white" style="font-size: 50px; text-align: center;">cloud_circle</i>
            </div>
            <label class="mdui-textfield-label label" style="color: white;">新梦</label>
            <div id="now_dream" class="tt"></div>
        </div>
        <div class="info-item">
            <div class="info-icon">
                <i class="
                icon
                mdui-icon
                material-icons
                mdui-text-color-white" style="font-size: 50px; text-align: center;">bookmark</i>
            </div>
            <label class="mdui-textfield-label label" style="color: white;">大学中最重要的事</label>
            <div id="important" class="tt"></div>
        </div>
        <div class="info-item">
            <div class="info-icon">
                <i class="
                icon
                mdui-icon
                material-icons
                mdui-text-color-white" style="font-size: 50px; text-align: center;">sentiment_very_satisfied</i>
            </div>
            <label class="mdui-textfield-label label" style="color: white;">最满意的事情</label>
            <div id="satisfaction" class="tt"></div>
        </div>
    </div>
</div>

    
</div>

        

<script> 
    document.getElementById("facer").src = "/static/img/facer/"+uid+".jpg"
    document.getElementById("name").innerHTML = sysuser[uid].realname
    $.get("/user/api/info",{uid:uid},function(data) {
        document.getElementById("life").innerHTML = data.life
        
        switch (data.gov) {
            case "1":text = "尊贵的群众";break
            case "2":text = "伟大的团员";break
            case "3":text = "最强的党员";break
        }
        document.getElementById("gov").innerHTML = text
        for(let item in data) {
            
            if (item == 'sex') {
                if (data[item] == '0') {s = `<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="30px" height="30.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="#EB5640" d="M 774.987 760.414 l -216.512 0 l 0 -119.588 c 67.915 -9.92716 128.833 -41.7967 175.12 -88.08 c 56.3876 -56.3839 91.3457 -134.45 91.3457 -220.442 c 0 -85.9956 -34.9582 -164.055 -91.3457 -220.449 c -56.3912 -56.3912 -134.45 -91.3385 -220.446 -91.3385 c -85.992 0 -164.055 34.9473 -220.446 91.3385 C 236.308 168.249 201.361 246.311 201.361 332.303 c 0 85.992 34.9473 164.058 91.3421 220.442 c 46.2834 46.2834 107.208 78.1529 175.116 88.08 l 0 119.588 L 251.315 760.414 c -25.0238 0 -45.3297 20.3131 -45.3297 45.3369 c 0 25.0202 20.3059 45.3333 45.3297 45.3333 L 467.819 851.084 l 0 96.9162 c 0 25.0274 20.3131 45.3333 45.3297 45.3333 c 25.0238 0 45.3297 -20.3059 45.3297 -45.3333 l 0 -96.9162 l 216.512 0 c 25.0166 0 45.3333 -20.3131 45.3333 -45.3333 C 820.32 780.727 800.003 760.414 774.987 760.414 Z M 513.149 553.432 c -61.0188 0 -116.362 -24.7962 -156.346 -64.7794 c -39.9832 -39.9832 -64.7794 -95.3339 -64.7794 -156.349 c 0 -61.0188 24.7962 -116.362 64.7794 -156.346 c 39.9832 -39.9868 95.3303 -64.783 156.346 -64.783 s 116.362 24.7962 156.342 64.783 c 39.9832 39.9832 64.7902 95.3303 64.7902 156.346 c 0 61.0152 -24.8034 116.366 -64.7902 156.349 C 629.511 528.636 574.164 553.432 513.149 553.432 Z"  /></svg>`}
                if (data[item] == '1') {s = `<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="30px" height="30.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="#1296db" d="M614.725125 60.260157c3.850928-1.130713 6.087067-1.788189 6.939618-2.037451C620.64963 58.515318 617.983603 59.302843 614.725125 60.260157z"  /><path fill="#1296db" d="M871.234488 313.576067c-99.954336-340.066549 24.210993 82.35061-75.743343-257.705101-7.282805-24.763706-33.289212-38.957229-58.052918-31.678036-66.332774 19.496677-103.563226 30.438947-123.193565 36.208114 0.169788-0.050575 0.3179-0.093925 0.480463-0.1445-14.171848 4.168828-51.593763 15.168899-134.988386 39.679729-24.763706 7.279193-38.953616 33.281987-31.674423 58.049305 7.282805 24.760093 33.281987 38.953616 58.045693 31.678036 103.639088-30.464235 124.956467-36.728314 128.547294-37.786778-0.04335 0.010838 0.032513-0.010838 0.0578-0.01445 0.0867-0.025288 0.2312-0.068638 0.437113-0.126438-0.122825 0.032513-0.2601 0.07225-0.3757 0.104763 0.195075-0.0578 0.343188-0.10115 0.422663-0.126438 0.007225 0 0.007225 0 0.007225 0 0.079475-0.025288 0.0578-0.01445 0.0578-0.01445 1.365526-0.400988 5.360954-1.575051 15.479574-4.548141-96.468271 176.947605 4.631228-6.936005-115.043759 212.407931-105.398377-26.86257-220.265124 2.239752-304.552036 86.530276-58.168518 58.175743-94.224907 138.694814-94.224907 227.388979 0 88.712227 36.060001 169.231299 94.224907 227.396204 58.168518 58.175743 138.687589 94.224907 227.396204 94.224907 88.70139 0 169.220461-36.049164 227.388979-94.224907 58.175743-58.168518 94.224907-138.687589 94.224907-227.396204 0-88.694165-36.049164-169.213236-94.224907-227.388979-19.738714-19.738714-41.12473-36.399577-63.612559-50.047612 150.637748-276.10719-21.898991 38.642941 113.873308-210.269329 5.574092 18.940351 7.109405 24.19293 7.452593 25.341706 0.780301 2.644352 6.459155 21.989304 37.859028 128.832682 7.282805 24.760093 33.289212 38.953616 58.052918 31.678036C864.327383 364.338954 878.513681 338.33616 871.234488 313.576067zM686.639215 673.478868c0 62.944246-25.576519 120.03985-66.820461 161.283793s-98.339547 66.820461-161.276568 66.820461c-62.944246 0-120.032625-25.576519-161.272956-66.820461s-66.820461-98.339547-66.820461-161.283793c0-62.937021 25.580131-120.0254 66.820461-161.265731 41.243943-41.243943 98.32871-66.824074 161.272956-66.824074 62.937021 0 120.032625 25.580131 161.276568 66.824074C661.062697 553.453468 686.639215 610.541847 686.639215 673.478868z"  /><path fill="#1296db" d="M546.250138 356.882749c-0.755013 0.223975-1.300501 0.382925-1.640076 0.480463C544.985762 357.254837 545.56015 357.085049 546.250138 356.882749z"  /><path fill="#1296db" d="M547.113526 356.626261c-0.30345 0.090313-0.59245 0.1734-0.863388 0.252875C546.51385 356.806886 546.792013 356.723799 547.113526 356.626261z"  /><path fill="#1296db" d="M552.452805 355.058435c-0.010838 0-0.018063 0.003613-0.0289 0.007225C552.434742 355.06566 552.441967 355.062048 552.452805 355.058435z"  /><path fill="#1296db" d="M552.423905 355.06566c-2.286714 0.671925-4.035165 1.188513-5.310379 1.560601C548.731927 356.149411 550.736866 355.564185 552.423905 355.06566z"  /><path fill="#1296db" d="M544.534199 357.384887c-0.140888 0.039738-0.238425 0.07225-0.307063 0.090313C544.299386 357.453524 544.396924 357.424624 544.534199 357.384887z"  /><path fill="#1296db" d="M544.610061 357.363212c-0.0289 0.007225-0.050575 0.01445-0.075863 0.021675C544.563099 357.377662 544.581161 357.374049 544.610061 357.363212z"  /><path fill="#1296db" d="M561.339561 394.770677c-0.007225 0-0.01445 0.003613-0.025288 0.007225 0.01445-0.003613 0.032513-0.007225 0.054188-0.01445C561.357624 394.763452 561.350399 394.767064 561.339561 394.770677 561.317886 394.774289 561.346786 394.767064 561.339561 394.770677z"  /><path fill="#1296db" d="M544.227136 357.475199C544.111536 357.511324 544.104311 357.511324 544.227136 357.475199L544.227136 357.475199z"  /></svg>`}
                if (data[item] == '2') {s = `<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="30px" height="30.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="#BDE4F9" d="M1000.533333 51.2c0-2.133333 0-2.133333-2.133333-4.266667 0-2.133333-2.133333-2.133333-2.133333-4.266666s-2.133333-2.133333-2.133334-4.266667c-2.133333-2.133333-4.266667-4.266667-4.266666-6.4-2.133333-2.133333-4.266667-4.266667-6.4-4.266667 0 0-2.133333-2.133333-4.266667-2.133333s-2.133333-2.133333-4.266667-2.133333-2.133333 0-4.266666-2.133334c-2.133333 0-2.133333 0-4.266667-2.133333h-179.2c-23.466667 0-42.666667 19.2-42.666667 42.666667s19.2 42.666667 42.666667 42.666666h68.266667l-96 96C712.533333 168.533333 657.066667 149.333333 597.333333 149.333333c-68.266667 0-132.266667 25.6-183.466666 70.4-17.066667 14.933333-19.2 42.666667-4.266667 59.733334 14.933333 17.066667 42.666667 19.2 59.733333 4.266666 34.133333-32 81.066667-49.066667 128-49.066666 51.2 0 100.266667 19.2 136.533334 55.466666 36.266667 36.266667 55.466667 85.333333 55.466666 136.533334 0 106.666667-85.333333 192-192 192-81.066667 0-151.466667-51.2-179.2-125.866667-8.533333-21.333333-32-34.133333-55.466666-25.6-21.333333 8.533333-34.133333 32-25.6 55.466667C377.6 631.466667 482.133333 704 597.333333 704c153.6 0 277.333333-123.733333 277.333334-277.333333 0-59.733333-19.2-117.333333-53.333334-164.266667L917.333333 166.4V234.666667c0 23.466667 19.2 42.666667 42.666667 42.666666s42.666667-19.2 42.666667-42.666666V64v-8.533333c-2.133333 0-2.133333-2.133333-2.133334-4.266667"  /><path fill="#1296db" d="M34.133333 989.866667c8.533333 8.533333 19.2 12.8 29.866667 12.8s21.333333-4.266667 29.866667-12.8L149.333333 934.4l55.466667 55.466667c8.533333 8.533333 19.2 12.8 29.866667 12.8s21.333333-4.266667 29.866666-12.8c17.066667-17.066667 17.066667-42.666667 0-59.733334L209.066667 874.666667l53.333333-53.333334c46.933333 34.133333 104.533333 53.333333 164.266667 53.333334 68.266667 0 132.266667-25.6 183.466666-70.4 17.066667-14.933333 19.2-42.666667 4.266667-59.733334-14.933333-17.066667-42.666667-19.2-59.733333-4.266666-34.133333 32-81.066667 49.066667-128 49.066666-51.2 0-100.266667-19.2-136.533334-55.466666-36.266667-36.266667-55.466667-85.333333-55.466666-136.533334 0-106.666667 85.333333-192 192-192 81.066667 0 151.466667 51.2 179.2 125.866667 8.533333 21.333333 32 34.133333 55.466666 25.6 21.333333-8.533333 34.133333-32 25.6-55.466667C646.4 392.533333 541.866667 320 426.666667 320c-153.6 0-277.333333 123.733333-277.333334 277.333333 0 59.733333 19.2 117.333333 53.333334 164.266667L149.333333 814.933333l-55.466666-55.466666c-17.066667-17.066667-42.666667-17.066667-59.733334 0-17.066667 17.066667-17.066667 42.666667 0 59.733333L89.6 874.666667l-55.466667 55.466666c-17.066667 17.066667-17.066667 42.666667 0 59.733334"  /></svg>`}
                document.getElementById("name").innerHTML += s
                break
            }
            document.getElementById(item).innerHTML = data[item]
    
        }
    })
</script>